s<template>
	<view class="">
		<view class="wrap" v-if="group_id==1">
			<!-- 顶部导航栏 -->
			<u-sticky bgColor="#fff">
				<u-tabs :list="list1" lineWidth="70" lineColor="#0C68FD" @click="changeTab" :activeStyle="{
			    color: '#0C68FD',
			    fontWeight: 'bold',
			    transform: 'scale(1.05)'
			}" :inactiveStyle="{
			    color: '#606266',
			    transform: 'scale(1)'
			}" itemStyle="padding-left: 90rpx; padding-right: 70rpx; height: 68rpx;"></u-tabs>
			</u-sticky>
			<view class="Columnss">
				<view class="block" @click="alltown">
					<text>全部</text><text></text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="cunshow=true">
					<text>村名</text><text>{{cunname}}</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="showname=true">
					<text>名字</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="showids=true">
					<text>身份证号</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>

			</view>
			<!-- 信息 -->
			<view class="" v-for="(item,index) in list" @click="goTown(item.id)">

				<view class="indexbody">
					<view class="indexbody_title">
						<view>走访人</view>
						<view>回访详情</view>
					</view>
					<view class="indexbody_content">
						<view class="">
							<text>{{item.name}}</text>
							<text v-if="item.sex==1">男</text>
							<text v-else-if="item.sex==0">女</text>
							<text>{{item.age}}岁</text>
							<text>{{item.idcard}}</text>
						</view>
						<view class="indexbody_address">
							<view class="">
								<image src="../../static/index/address.png" mode=""></image>
							</view>
							<view class="">
								<text>{{item.city}}{{item.detail}}</text>
							</view>
						</view>
					</view>
					<view class="indexbody_time">
						<text>回访时间: {{item.recentlytime}}</text>
					</view>
					<view class="indexbody_bottom">
						<view class="indexbody_date">
							<text v-if="item.status==1">电访</text>
							<text v-else-if="item.status==2">面访</text>
						</view>
						<view class="Pass" v-if="item.check_status==0">
							<image src="../../static/mayor/shenhezhong.png" mode=""></image>
						</view>
						<view class="Pass" v-else-if="item.check_status==1">
							<image src="../../static/mayor/Pass.png" mode=""></image>
						</view>
						<view class="Pass" v-else-if="item.check_status==2">
							<image src="../../static/mayor/Failed.png" mode=""></image>
						</view>
					</view>
				</view>
			</view>
			<view class="loadingText">{{loadingText}}</view>
			<u-modal :show="showname" :title="titlename" @confirm="confirmname" confirmButtonShape="circle"
				confirmColor="#0C68FD" @close="close" :closeOnClickOverlay="true">
				<textarea v-model="name" placeholder="请输入地址"
					style="border:1rpx solid #dedede;padding:30rpx;height:60rpx">
				</textarea>

			</u-modal>
			<u-modal :show="showids" :title="titleids" @confirm="confirmids" confirmButtonShape="circle"
				confirmColor="#0C68FD" @close="close" :closeOnClickOverlay="true">
				<textarea v-model="idcard" placeholder="请输入地址"
					style="border:1rpx solid #dedede;padding:30rpx;height:60rpx">
				</textarea>

			</u-modal>
			<u-picker :show="cunshow" :columns="cunlist" @cancel="cancel" @confirm="confirmcun" keyName="name">
			</u-picker>
		</view>
		<view class="wrap" v-if="group_id==2">
			<!-- <view class="tabs">
				<u-sticky bgColor="#fff">
					<u-tabs :list="list2" lineWidth="70" lineColor="#0C68FD" @click="changeTab1" :activeStyle="{
				    color: '#0C68FD',
				    fontWeight: 'bold',
				    transform: 'scale(1.05)'
				}" :inactiveStyle="{
				    color: '#606266',
				    transform: 'scale(1)'
				}" itemStyle="padding-left: 90rpx; padding-right: 70rpx; height: 68rpx;"></u-tabs>
				</u-sticky>
			</view> -->
			<view class="Columnsss">
				<view class="block" @click="allcun">
					<text>全部</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="showtype=true">
					<text>{{typename}}</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="showname=true">
					<text>名字</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="showids=true">
					<text>身份证号</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>

			</view>
			<view class="indexbodys" v-for="item in list" @click="Telephone_interview_details(item.id)">
				<view class="indexbody_title">
					<view>走访人</view>
					<view class="indexbody_title_select">
						<view>回访详情</view>
						<u-icon name="arrow-right" color="#CCCCCC" size="28"></u-icon>
					</view>
				</view>
				<view class="indexbody_content">
					<view class="">
						<text>{{item.name}}</text>
						<text v-if="item.sex==1">男</text>
						<text v-else-if="item.sex==0">女</text>
						<text>{{item.age}}岁</text>
						<text>{{item.idcard}}</text>
					</view>
					<view class="indexbody_address">
						<view class="">
							<image src="../../static/index/address.png" alt="">
						</view>
						<view class="">
							<text>{{item.city}}{{item.detail}}</text>
						</view>
					</view>
				</view>
				<view class="indexbody_time">
					<text>回访时间: {{item.recentlytime}}</text>
				</view>
				<view class="indexbody_bottom">
					<view class="indexbody_date">
						<text class="tel" v-if="item.type==1">电访</text>
						<text class="face" v-else-if="item.type==2">面访</text>
					</view>
					<view class="Decide">
						<text class="no" @click.stop="operate(1,item)">不通过</text>
						<text class="pass" @click.stop="operate(2,item)">通过</text>
						<!-- <u-button class="Fail" type="primary" :plain="true" text="不通过1" @click.stop="operate(1,item)"></u-button>
						<u-button class="success" type="primary" text="通过1" @click.stop="operate(2,item)"></u-button> -->
					</view>
				</view>
			</view>
			<view class="loadingText">{{loadingText}}</view>
			<u-modal :show="showname" :title="titlename" @confirm="confirmname" confirmButtonShape="circle"
				confirmColor="#0C68FD" @close="close" :closeOnClickOverlay="true">
				<textarea v-model="name" placeholder="请输入地址"
					style="border:1rpx solid #dedede;padding:30rpx;height:60rpx">
				</textarea>

			</u-modal>
			<u-modal :show="showids" :title="titleids" @confirm="confirmids" confirmButtonShape="circle"
				confirmColor="#0C68FD" @close="close" :closeOnClickOverlay="true">
				<textarea v-model="idcard" placeholder="请输入地址"
					style="border:1rpx solid #dedede;padding:30rpx;height:60rpx">
				</textarea>

			</u-modal>
			<u-picker :show="showtype" :columns="typelist" @cancel="canceltype" @confirm="confirmtype" keyName="name">
			</u-picker>
		</view>
		<view class="wrap" v-if="group_id==3">
			<view class="banner">
				<image src="../../static/index/index-banner.png" mode=""></image>
			</view>
			<!-- 分栏 -->
			<view class="Columns">
				<view class="block" @click="alls">
					<text>全部</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block">
					<picker mode="multiSelector" :range="mulSelect" :range-key="'name'" @change="pickerChange"
						@columnchange="colChange">
						<view style="width: 140rpx;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;"
							:class="{active:isActive}">{{address}}
						</view>
						<u-icon slot="right" name="arrow-right" ></u-icon>
					</picker>
					<image src="../../static/index/polygon.png" mode="" ></image>
				</view>
				<view class="block" @click="showaddress=true">
					<text>地址</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="show = true">
					<u-picker :show="show" :columns="columns" @confirm="confirm" @cancel="cancel"></u-picker>
					<view>{{query.visit}}</view>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="showname=true">
					<text>名字</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>
				<view class="block" @click="showids=true">
					<text>身份证号</text>
					<image src="../../static/index/polygon.png" mode=""></image>
				</view>

			</view>
			<!-- 地址搜索弹框 -->
			<u-modal :show="showaddress" :title="title" @confirm="confirms" confirmButtonShape="circle"
				confirmColor="#0C68FD" @close="close" :closeOnClickOverlay="true">
				<textarea v-model="detail" placeholder="请输入地址"
					style="border:1rpx solid #dedede;padding:30rpx;height:60rpx">
				</textarea>

			</u-modal>
			<u-modal :show="showname" :title="titlename" @confirm="confirmname" confirmButtonShape="circle"
				confirmColor="#0C68FD" @close="close" :closeOnClickOverlay="true">
				<textarea v-model="name" placeholder="请输入地址"
					style="border:1rpx solid #dedede;padding:30rpx;height:60rpx">
				</textarea>

			</u-modal>
			<u-modal :show="showids" :title="titleids" @confirm="confirmids" confirmButtonShape="circle"
				confirmColor="#0C68FD" @close="close" :closeOnClickOverlay="true">
				<textarea v-model="idcard" placeholder="请输入地址"
					style="border:1rpx solid #dedede;padding:30rpx;height:60rpx">
				</textarea>

			</u-modal>
			<!-- 主要内容区域 -->
			<view>
				<view class="indexbody" v-for="item in list" :key="item.id" @click="go(item.id)">
					<view class="indexbody_title">
						<view>{{item.name}}</view>
						<view @click="Callbackfordetails(item.id,item.check_status)">
							<image src="../../static/index/edit.png" mode=""></image>
						</view>
					</view>
					<view class="indexbody_content">
						<text>{{item.sex | sexType}}</text>
						<text>{{item.age}}岁</text>
						<text>{{item.phone}}</text>
					</view>
					<view class="indexbody_address">
						<view class="">
							<image src="../../static/index/address.png" mode=""></image>
						</view>
						<view class="">
							<text>{{item.city}}{{item.detail}}</text>
						</view>
					</view>
					<view class="indexbody_date" style="display:flex;justify-content: flex-start;">
						<view>
							<image src="../../static/index/time.png" mode=""></image>
						</view>
						<text>{{item.recentlytime}}</text>
					</view>
				</view>
				<view class="loadingText">{{loadingText}}</view>
			</view>
		</view>

	</view>
</template>

<script>
	import Vue from 'vue'
	export default {
		data() {
			return {
				show: false,
				showaddress: false,
				showname: false,
				showids: false,
				cunshow: false,
				// 搜索地址
				cancellation: '',
				title: '请选择省市区/村',
				titlename: '请输入名字',
				titleids: '请输入身份证号',
				columns: [
					['全部', '本月已走访', '本月未走访'],
				],
				query: {
					visit: '本月已走访',
					villagesandtowns: '省市区/村',
					principal: '负责人'
				},

				provinceList: [],
				province: [], //省数组
				city: [], //市数组
				district: [], //区数组
				street: [], //街道数组
				mulSelect: [], //四级联动显示数组，该数组的值为[[province],[city],[district],[street]]
				provinceId: '', //省的id
				cityId: '', //市的id
				districtId: '', //区的id
				countryId: '', //村的id
				address: '请选择地址',
				isActive: false, //字体颜色样式
				addressText: '',

				listQuery: {
					page: 1,
					status: 0,
					count: 0,
				},
				list2: [{
					name: '电访',
					id: 1,

				}, {
					name: '面访',
					id: 2
				}],
				list1: [{
					name: '全部',
					id: 0
				}, {
					name: '合格',
					id: 1,

				}, {
					name: '不合格',
					id: 2
				}],
				list3: [{
					name: '全部',
					id: 0
				}, {
					name: '合格',
					id: 1,

				}],
				listData: [],
				group_id: uni.getStorageSync("group_id"),
				list: [],
				page: 1,
				loadingText: '',
				status: 0,
				type: 1,
				detail: '',
				name: '',
				idcard: '',
				cun_id: '',
				cunlist: [],
				cunname: '',
				month_visit: 0,
				typename: '电访',
				showtype: false,
				typelist: [
					[{
						name: '电访',
						id: 1
					}, {
						name: '面访',
						id: 2,

					}]
				],
				city_id1:'',
				area_id1 :'',
				rovince_id1: '',
				q_id1:''
			}
		},

		onPullDownRefresh() {
			this.page = 1
			this.getList();
		},
		onReachBottom() {
			this.loadingText = "上拉显示更多"
			this.getMoreList();
		},
		onLoad() {
			this.getAddress();
			this.mulSelect.push(this.province);
			
			this.provinceId = '';
			this.getCity();
			this.mulSelect.push(this.city);
			
			this.cityId = '';
			this.getDistrict();
			this.mulSelect.push(this.district);
			
			this.districtId = '';
			this.getStreet();
			this.mulSelect.push(this.street);
			this.countryId = '';
			this.provinceId1='';
			 this.cityId1='';
			 this.districtId1='';
			this.countryId1='';
			this.address = '请选择地址'
			
		},

		onShow() {
           
			this.list = [];
			this.page = 1;
			this.detail = '';
			this.month_visit = 0;
			this.area_id= '';
			this.city_id = '';
			this.detail = '';
			this.idcard = '';
			this.name = '';
			this.province_id = '';
			this.q_id = '';
			this.provinceId1='';
			 this.cityId1='';
			 this.districtId1='';
			this.countryId1='';
			this.address = '请选择地址'
			this.getList();

			console.log(this.group_id)
			if (this.group_id == 1) {
				this.getCunInfo();
				uni.setNavigationBarTitle({
					title: '回访记录'
				});
				console.log(555)
				uni.setTabBarItem({
					index: 0,
					text: '首页',
					iconPath: '/static/index/home.png',
					selectedIconPath: '/static/index/homeselect.png',
				});
				uni.setTabBarItem({
					index: 1,
					text: '新增',
					iconPath: '/static/index/newadd.png',
					selectedIconPath: '/static/index/addselect.png',
					visible: false
				});
				uni.setTabBarItem({
					index: 2,
					text: '我的',
					iconPath: '/static/index/mine.png',
					selectedIconPath: '/static/index/mineselect.png',
				});

			}
			if (this.group_id == 2) {
				//镇长

				uni.setNavigationBarTitle({
					title: '回访记录'
				});
				uni.setTabBarItem({
					index: 0,
					text: '首页',
					iconPath: '/static/index/home.png',
					selectedIconPath: '/static/index/homeselect.png'
				});
				uni.setTabBarItem({
					index: 1,
					text: '新增',
					iconPath: '/static/index/newadd.png',
					selectedIconPath: '/static/index/addselect.png',
					visible: false

				});
				uni.setTabBarItem({
					index: 2,
					text: '我的',
					iconPath: '/static/index/mine.png',
					selectedIconPath: '/static/index/mineselect.png'
				});




			}


			if (this.group_id == 3) {

				uni.setNavigationBarTitle({
					title: '走访记录'
				});
				uni.setTabBarItem({
					index: 1,
					text: '首页',
					iconPath: '/static/index/home.png',
					selectedIconPath: '/static/index/homeselect.png'
				});
				uni.setTabBarItem({
					index: 1,
					text: '新增',
					iconPath: '/static/index/newadd.png',
					selectedIconPath: '/static/index/addselect.png'
				});
				uni.setTabBarItem({
					index: 2,
					text: '我的',
					iconPath: '/static/index/mine.png',
					selectedIconPath: '/static/index/mineselect.png'
				});
			}


		},
		methods: {
			alls(){
				 this.provinceId1='';
				 this.cityId1='';
				 this.districtId1='';
				 this.countryId1='';
				 this.detail='';
				 this.month_visit=0;
				 this.name='';
				 this.idcard='';
				 this.list = [];
				 this.page = 1
				 this.getList();
			},
			allcun(){
				this.type = 1;
				this.name = '';
				this.idcard = '';
				this.typename = '电访';
				this.list = [];
				this.page = 1;
				this.getList();
			},
			alltown(){
				
				this.status = 0;
				this.idcard = '';
				this.name='';
				this.cunname = '';
			    this.cun_id='';
				this.list = [];
				this.page = 1
				this.getList();
			},
			getCunInfo() {
				this.$api.post('/api/villagers/getCun').then(res => {
					if (res.code == 1) {

						console.log(res.data)
						this.cunlist = [res.data];
					} else {
						this.toastMsg(res.msg);
					}
				});
			},
			operate(type, item) {
				console.log()
				let arr = [];
				let obj = {};
				let objs = {};


				console.log(arr)
				obj.id = item.id;

				if (type == 1) {
					obj.status = 2;
				} else if (type == 2) {
					obj.status = 1;
				}
				arr.push(obj);
				objs.json_data = JSON.stringify(arr)
				this.$api.post('/api/villagers/villageheadCheck', objs).then(res => {
					if (res.code == 1) {
						this.toastMsg(res.msg);
						this.list = [];
						this.page = 1
						this.getList();
					} else {
						this.toastMsg(res.msg);
					}
				});
			},
			go(id) {
				uni.navigateTo({
					url: './Interview-details?villager_id=' + id,
					// url:'Village_branch_interview'
				})
			},
			changeTab(item) {
				console.log(item)
				this.status = item.id;
				console.log(this.status)
				this.list = [];
				this.page = 1
				this.getList();
			},
			// changeTab1(item){
			// 	console.log(item)
			// 	this.sta = item.id;
			// 	this.list = [];
			// 	this.page = 1
			// 	this.getList();
			// },
			getMoreList() {
				this.loadingText = '-- 正在加载 --'
				let obj = {};
				obj.page = this.page;
				let url = ''
				if (uni.getStorageSync("group_id") == 1) {
					obj.status = this.status;
					obj.name = this.name;
					obj.idcard = this.idcard;
					obj.cun_id = this.cun_id;
					url = '/api/villagers/visitList'
				} else if (uni.getStorageSync("group_id") == 2) {
					obj.type = this.type;
					obj.name = this.name;
					obj.idcard = this.idcard;
					url = '/api/villagers/villageheadIndex'
				} else if (uni.getStorageSync("group_id") == 3) {
					obj.city_id = this.provinceId1;
					obj.q_id = this.cityId1;
					obj.zhen_id = this.districtId1;
					obj.area_id = this.countryId1;
					obj.detail = this.detail;
					obj.month_visit = this.month_visit;
					obj.name = this.name;
					obj.idcard = this.idcard;
					url = '/api/villagers/allVillagerList'
				}
				this.$api.post(url, obj).then(res => {
					if (res.code == 1) {
						this.info = res.data;
						if (res.data.list.length == 0 || res.data.list == null) {
							this.loadingText = '-- 暂无更多 --'
							return false;
						}
						var newlist = res.data.list;
						this.list = this.list.concat(newlist)
						this.page++
					} else {
						this.toastMsg(res.msg);
					}
				});
			},

			getList() {
				console.log(666)
				let obj = {};
				obj.page = this.page;
				let url = ''
				if (uni.getStorageSync("group_id") == 1) {
					obj.status = this.status;
					obj.name = this.name;
					obj.idcard = this.idcard;
					obj.cun_id = this.cun_id;
					url = '/api/villagers/visitList'
				} else if (uni.getStorageSync("group_id") == 2) {
					url = '/api/villagers/villageheadIndex'
					obj.type = this.type;
					obj.name = this.name;
					obj.idcard = this.idcard;
				} else if (uni.getStorageSync("group_id") == 3) {
					obj.city_id = this.provinceId1;
					obj.q_id = this.cityId1;
					obj.zhen_id = this.districtId1;
					obj.area_id = this.countryId1;
					obj.detail = this.detail;
					obj.month_visit = this.month_visit;
					obj.name = this.name;
					obj.idcard = this.idcard;
					url = '/api/villagers/allVillagerList'
				}


				this.$api.post(url, obj).then((res) => {
					if (res.code == 1) {
						if (res.data.list.length == 0 || res.data.list == null) {
							this.loadingText = '-- 暂无更多 --'
							return false;
						}
						this.list = res.data.list;
						uni.stopPullDownRefresh()
						this.page++
					} else {
						this.toastMsg(res.msg);
					}
				})
			},

			confirmcun(e) {
				console.log('confirm', e)
				this.cun_id = e.value[0].id;
				this.cunname = e.value[0].name;
				this.list = [];
				this.page = 1;
				this.getList();
				this.cunshow = false;
			},
			confirmtype(e) {
				console.log('confirm', e)
				this.type = e.value[0].id;
				this.typename = e.value[0].name;
				this.list = [];
				this.page = 1;
				this.getList();
				this.showtype = false;
			},
			canceltype() {
				this.showtype = false;
			},
			cancel() {
				this.cunshow = false;
			},
			confirms() {
				this.showaddress = false;
				this.list = [];
				this.page = 1;
				this.getList();
			},
			confirmname() {
				this.showname = false;
				this.list = [];
				this.page = 1;
				this.getList();
			},
			confirmids() {
				this.showids = false;
				this.list = [];
				this.page = 1;
				this.getList();
			},
			close() {
				this.closeOnClickOverlay = false;
			},

			confirm(e) {
				this.query.visit = e.value[0];
				console.log(e)
				this.show = false;
				this.month_visit = e.indexs[0];
				this.page = 1;
				this.getList();

			},
			cancel() {
				this.show = false;
			},
			// // 省市区
			// townsconfirm(e) {
			// 	// console.log(e.value)
			// 	this.query.villagesandtowns = e.value[0];
			// 	this.towns = false;
			// },
			// tocancel() {
			// 	this.towns = false;
			// },
			//负责人
			confirmprincipal(e) {
				this.query.principal = e.value[0];
				this.principal = false;
			},
			cancelprincipal() {
				this.principal = false;
			},
			// 地址
			// open() {
			// 	// this.address = true;
			// 	console.log(22)
			// },
			// close() {
			// 	this.address = false;
			// },
			// 跳转到电访详情
			Callbackfordetails(id, check_status) {
				uni.navigateTo({
					url: "./Callbackfordetails?villager_id=" + id + "&check_status=" + check_status
					// url:"./Interview_details"
				})
			},

			toReturnVisitdetails() {
				uni.navigateTo({
					url: '../../villageBranch/Return-visit-detailss',
					// url:'Village_branch_interview'
				})
			},
			goTown(id){
				uni.navigateTo({
					url: '../mayor/townDetail?villager_id=' + id
				})
			},
			Telephone_interview_details(id) {
				console.log(id)

				uni.navigateTo({
					url: '../mayor/Qualified-details?villager_id=' + id
				})
			},
			pickerChange(e) {
				console.log(34343434)
				//什么都不选的话，e.detail.value的值为[null,null,null,null]
				//只选择省的话，e.detail.value的值为[数字,null,null,null]
				//只选择市的话，e.detail.value的值为[数字,数字,null,null]
				//所以获取e.detail.value的值先判断是否为null，如果为null则取值为0
				for (var i = 0; i < e.detail.value.length; i++) {
					if (!e.detail.value[i]) {
						e.detail.value[i] = 0;
					}
				}

				var s_province = this.mulSelect[0][e.detail.value[0]]; //获取选中的省
				var s_city = this.mulSelect[1][e.detail.value[1] || 0]; //获取选中的市
				var s_district = this.mulSelect[2][e.detail.value[2] || 0]; //获取选中的区
				var s_street = this.mulSelect[3][e.detail.value[3] || 0]; //获取选中的街道
				console.log(e.detail.value);
				//赋值显示在页面
				this.address = s_province.name + s_city.name + s_district.name + s_street.name;
				this.addressText = s_province.name + '/' + s_city.name + '/' + s_district.name
				//将字体颜色修改为黑色
				this.isActive = true;
				 this.provinceId1=this.provinceId;
				 this.cityId1=this.cityId;
				 this.districtId1=this.districtId;
				this.countryId1=this.countryId;
				 this.list = [];
				this.page = 1;
				this.getList();
				
			},
			colChange(e) {
							if (e.detail.column == 0) {
			                console.log(e.detail.value)
								this.provinceId = this.provinceList[e.detail.value].id;
								console.log(this.provinceId)
			
								this.getCity();
								Vue.set(this.mulSelect, 1, this.city)
			
			
								this.getDistrict();
								Vue.set(this.mulSelect, 2, this.district)
								this.getStreet();
								Vue.set(this.mulSelect, 3, this.street)
							} else if (e.detail.column == 1) {
			
								//选择市
								for (var i = 0; i < this.provinceList.length; i++) {
									if (this.provinceList[i].id == this.provinceId) {
										this.cityId = this.provinceList[i].children[e.detail.value].id;
									}
								}
			              
								this.getDistrict();
								Vue.set(this.mulSelect, 2, this.district)
			               this.getStreet();
								Vue.set(this.mulSelect, 3, this.street)
							
			
							} else if (e.detail.column == 2) {
			//                console.log(22222)
							
								
								//选择区
								for (var i = 0; i < this.provinceList.length; i++) {
									if (this.provinceList[i].id == this.provinceId) {
										for (var j = 0; j < this.provinceList[i].children.length; j++) {
											if (this.provinceList[i].children[j].id == this.cityId) {
												this.districtId = this.provinceList[i].children[j].children[e.detail.value].id;
												console.log(this.districtId)
												for(var k = 0; k < this.provinceList[i].children[j].children.length; k++){
													if (this.provinceList[i].children[j].children[k].id == this.districtId) {
														this.countryId =  this.provinceList[i].children[j].children[k].children[e.detail.value].id;
												}
												}
											}
										}
									}
								}
			             
								// this.getDistrict();
								// Vue.set(this.mulSelect, 2, this.district)
								this.getStreet();
								Vue.set(this.mulSelect, 3, this.street)
							}else if (e.detail.column ==3) {
			
								for (var i = 0; i < this.provinceList.length; i++) {
									if (this.provinceList[i].id == this.provinceId) {
										for (var j = 0; j < this.provinceList[i].children.length; j++) {
											if (this.provinceList[i].children[j].id == this.cityId) {
												for(var k = 0; k < this.provinceList[i].children[j].children.length; k++){
													
													if(this.provinceList[i].children[j].children[k].id == this.districtId){
														this.countryId = this.provinceList[i].children[j].children[k].children[e.detail.value].id;
														console.log(this.countryId)
														console.log(45454545)
													}
												     
												
												}
			
			
			
											}
										}
									}
								}
			               
								
							}
			
						},
			     getAddress() {
							this.$api.post('/api/villagers/getCityList').then((res) => {
								this.provinceList = [];
								if (res.code == 1) {
									this.provinceList = res.data;
									console.log(this.provinceList)
								// 	var distr = {};
								
								// 	if(this.provinceList[0].children[0].children.length>0){
								// 		 distr.id = this.provinceList[0].children[0].children[0].id;
								// 	}
								// 	if(this.provinceList[0].children[0].children.length>0){
								// 		 distr.name = this.provinceList[0].children[0].children[0].name;
								// 	}
									
									 
									
									for (var i = 0; i < this.provinceList.length; i++) {
										var pro = {};
										pro.id = this.provinceList[i].id; //获取省id
										pro.name = this.provinceList[i].name; //获取省名
			
										this.province.push(pro); //将获取到的id，name放入省名称数组
										this.provinceId =this.province[0].id; 
										for(var k = 0; k < this.provinceList[i].children.length; k++){
											var cit = {};
											cit.id = this.provinceList[i].children[k].id;
											 cit.name = this.provinceList[i].children[k].name;
											this.city.push(cit);
											console.log(this.city);
											this.cityId =this.city[0].id;
											
											
										}
										
										for(var g = 0; g < this.provinceList[i].children[0].children.length; g++){
											
											if(this.provinceList[i].children[0].children.length>0){
												console.log(this.provinceList[i].children[0 ].children)
												console.log(7777);
												var distr = {}
												distr.id = this.provinceList[i].children[0].children[g].id;
												 distr.name = this.provinceList[i].children[0].children[g].name;
												 
												 this.district.push(distr);
												this.districtId =this.district[0].id;
											}
											
											
										}
										
										if(this.provinceList[i].children[0].children.length>0){
											if(this.provinceList[i].children[0].children[0].children.length>0){
												// this.districtId =this.provinceList[i].children[0].children[0].id;
												for(var h = 0; h < this.provinceList[i].children[0].children[0].children.length; h++){
													
													if(this.provinceList[i].children[0].children[0].children.length>0){
														// this.countryId =this.provinceList[i].children[0].children[0].children[0].id;
														console.log(this.provinceList[i].children[0].children[0].children)
														console.log(7777);
														var str = {}
														str.id = this.provinceList[i].children[0].children[0].children[h].id;
														 str.name = this.provinceList[i].children[0].children[0].children[h].name;
														 
														 this.street.push(str);
														this.countryId =this.street[0].id;
													}
													
													
												}
											}
										}
									}
			
								} else {
									this.toastMsg(res.msg);
								}
							})
						},
						getCity() {
							console.log(999)
							
							this.street = [];
							for (var i = 0; i < this.provinceList.length; i++) {
								//寻找与省id匹配的索引
								if (this.provinceList[i].id == this.provinceId) {
			
									if (this.city.length) { //清空历史数据
										this.city = [];
										this.street = [];
									}
			
									for (var j = 0; j < this.provinceList[i].children.length; j++) {
										var ci = {};
										ci.id = this.provinceList[i].children[j].id; //获取城市id
										ci.name = this.provinceList[i].children[j].name; //获取城市名
										console.log(ci.name)
										//将城市id，name放入城市数组
										this.city.push(ci);
										// console.log(this.city)
										
										for(var k = 0;k < this.city[j].children.children.length; k++){
												console.log(this.this.city[j].children)
												console.log(898983333333333)
											
											if(this.city[j].children.length>0){
												
												console.log(this.city[j].children)
												var distr = {};
												distr.id = this.city[j].children[0].id;
												distr.name = this.city[j].children[0].name;
												this.district.push(distr)
												
												// this.districtId = this.district[0].id;
												console.log(this.districtId )
											}
										}
										
										for(var k = 0; k < this.provinceList[i].children[j].children.length; k++){
											
											
											if(this.provinceList[i].children[j].children[k].length>0){
												
												var str = {}; 
												str.id = this.city[j].children[0].id;
												str.name = this.city[j].children[0].name;
												this.street.push(str)
												
												// this.countryId = this.street[k].id;
												// console.log(this.countryId )
											}
										}
										
										
										
										
										
									}
								}
							}
						},
						getDistrict() {
							
						
							for (var i = 0; i < this.provinceList.length; i++) {
								//寻找与省id匹配的索引
								// console.log(this.provinceId)
								// console.log(this.districtId)
								if (this.provinceList[i].id == this.provinceId) {
									// console.log(this.provinceId)
									for (var j = 0; j < this.provinceList[i].children.length; j++) {
										//寻找与市id匹配的索引
										if (this.provinceList[i].children[j].id == this.cityId) {
											console.log(this.cityId)
											if (this.district.length) { //清空历史数据
												this.district = [];
												
											}
											for (var k = 0; k < this.provinceList[i].children[j].children.length; k++) {
												var di = {};
												di.id = this.provinceList[i].children[j].children[k].id; //获取区id
												di.name = this.provinceList[i].children[j].children[k].name; //获取区名
												//将区id，name放入区数组
												this.district.push(di);
												this.districtId =this.district[0].id;
												console.log(this.district)
													for(var h = 0; h < this.provinceList[i].children[j].children[k].children.length; h++){
														
														if(this.provinceList[i].children[j].children[k].children.length>0){
															console.log(this.provinceList[i].children[j].children[k].children)
															console.log(78787878787878);
															var str = {}
															str.id = this.provinceList[i].children[j].children[k].children[h].id;
															 str.name = this.provinceList[i].children[j].children[k].children[h].name;
															 
															 this.street.push(str);
															 console.log( this.street)
															// this.countryId =this.street[0].id;
														}
														
														
													}
											}
											
										}
									}
								}
							}
						},
						getStreet() {
							console.log(6676767676)
							this.street= [];
							
							for (var i = 0; i < this.provinceList.length; i++) {
								//寻找与省id匹配的索引
								if (this.provinceList[i].id == this.provinceId) {
									for (var j = 0; j < this.provinceList[i].children.length; j++) {
										//寻找与市id匹配的索引
										if (this.provinceList[i].children[j].id == this.cityId) {
											for (var k = 0; k < this.provinceList[i].children[j].children.length; k++) {
												//寻找与区id匹配的索引
												if (this.provinceList[i].children[j].children[k].id == this.districtId) {
													//循环遍历输出街道
													if (this.street.length) { //清空历史数据
														this.street = [];
													}
													for (var l = 0; l < this.provinceList[i].children[j].children[k].children
														.length; l++) {
															if(this.provinceList[i].children[j].children[k].children.length>0){
																var st = {};
																st.id = this.provinceList[i].children[j].children[k].children[l].id;
																st.name = this.provinceList[i].children[j].children[k].children[l].name;
																
																this.street.push(st);
																this.countryId =this.street[l].id;
															}
														
													}
												}
											}
										}
									}
								}
							}
						}
		},
		filters: {
			sexType(val) {
				switch (val) {
					case 0:
						val = '女'
						break;
					case 1:
						val = '男'
						break;
				}
				return val
			}
		}
	}
</script>

<style>
	page {
		background-color: #EFF1F5;
	}

	/deep/.u-tabs__wrapper__nav__line {
		left: 44rpx;
	}
</style>
<style lang="scss" scoped>
	.tabs {
		display: flex;
		justify-content: center;
		background-color: #fff;
	}

	.loadingText {
		padding: 20rpx 0 40rpx 0;
		text-align: center;
		color: #310D05;
		font-size: 28rpx;
	}

	.indexbodys {
		margin: 30rpx 20rpx;
		background-color: #fff;
		border-radius: 10rpx;

		.indexbody_title {
			display: flex;
			justify-content: space-between;
			padding: 20rpx;

			img {
				width: 40rpx;
				height: 40rpx;
			}

			:first-child {
				font-weight: bold;
			}

			:last-child {
				color: #CCCCCC;
				font-size: 24rpx;
			}

			.indexbody_title_select {
				display: flex;

				text {
					padding-right: 10rpx;
				}
			}
		}

		.indexbody_content {

			background-color: #F8F8F8;
			margin: 10rpx 40rpx;
			padding: 10rpx;
			font-size: 30rpx;

			text {
				padding: 0 16rpx;
				border-right: 2rpx solid #333333;
			}

			:last-child {
				border-right: none;
			}
		}

		.indexbody_address {
			display: flex;
			margin: 20rpx 20rpx;

			image {
				width: 40rpx;
				height: 40rpx;
			}
		}

		.indexbody_time {
			margin: 16rpx 40rpx;
		}

		.indexbody_bottom {
			display: flex;
			justify-content: space-between;
			margin: 40rpx 0 40rpx 40rpx;

			.indexbody_date {
				margin-top: 20rpx;

				.tel {
					padding: 6rpx;
					font-size: 28rpx;
					background-color: #EFF2FA;
					color: #5F7FD0;

				}

				.face {
					padding: 6rpx;
					font-size: 28rpx;
					background-color: #FAF6EF;
					color: #D0AA5F;
				}
			}

			.Decide {
				display: flex;
				align-content: flex-start;
				padding-right: 40rpx;
				margin-bottom: 40rpx;

				text {
					display: flex;
					justify-content: center;
					align-items: center;
					width: 144rpx;
					height: 64rpx;
					border-radius: 16rpx;
				}

				.no {

					border: 1rpx solid #3C9CFF;
					color: #3C9CFF;
					margin-right: 20rpx;
				}

				.pass {
					background-color: #3C9CFF;
					color: #fff;
				}

				.Fail {
					margin-right: 40rpx;
					border-radius: 100rpx;
					width: 100px;
				}

				.success {
					border-radius: 100rpx;
					width: 200rpx;
					padding: 10rpx auto;
				}
			}

		}

	}

	.indexbody {
		margin: 30rpx 20rpx;
		background-color: #fff;
		border-radius: 10rpx;

		.indexbody_title {
			display: flex;
			justify-content: space-between;
			padding: 20rpx;

			img {
				width: 40rpx;
				height: 40rpx;
			}

			:first-child {
				font-weight: bold;
			}

			:last-child {
				color: #CCCCCC;
				font-size: 24rpx;
			}
		}

		.indexbody_content {

			background-color: #F8F8F8;
			margin: 10rpx 40rpx;
			padding: 10rpx;
			font-size: 30rpx;

			text {
				padding: 0 16rpx;
				border-right: 2rpx solid #333333;
			}

			:last-child {
				border-right: none;
			}
		}

		.indexbody_address {
			display: flex;
			margin: 20rpx 20rpx;

			img {
				width: 40rpx;
				height: 40rpx;
			}
		}

		.indexbody_time {
			margin: 16rpx 40rpx;
		}

		.indexbody_bottom {
			display: flex;
			justify-content: space-between;
			margin: 40rpx 0 40rpx 40rpx;

			.indexbody_date {

				padding-bottom: 40rpx;

				text:first-child {
					padding: 6rpx;
					font-size: 28rpx;
					background-color: #F8F8F8;
					color: #5F7FD0;

				}
			}

			.Pass {
				image {
					width: 122rpx;
					height: 122rpx;
				}

			}
		}

	}

	.banner {
		image {
			width: 100%;
			height: 424rpx;
		}
	}

	.Columnss {
		margin: 16rpx 24rpx;
		display: flex;
		justify-content: space-between;

		.block {
			display: flex;
			color: #333333;
			font-size: 28rpx;

			image {
				margin-top: 10rpx;
				width: 13px;
				height: 16rpx;
				margin-left: 10rpx;
			}
		}
	}

	.Columnsss {
		margin: 16rpx 24rpx;
		display: flex;
		justify-content: space-between;

		.block {
			display: flex;
			color: #333333;
			font-size: 28rpx;

			image {
				margin-top: 10rpx;
				width: 13px;
				height: 16rpx;
				margin-left: 10rpx;
			}
		}
	}

	// 分栏
	.Columns {
		margin: 16rpx 24rpx;
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;

		.block {
			display: flex;
			color: #333333;
			font-size: 28rpx;
			justify-content: center;
			width: calc(100% /3);
			padding-bottom: 30rpx;

			image {
				margin-top: 10rpx;
				width: 13px;
				height: 16rpx;
				margin-left: 10rpx;
			}
		}
	}

	// 主体内容
	.indexbody {
		margin: 30rpx 20rpx;
		background-color: #fff;
		border-radius: 10rpx;

		.indexbody_title {
			display: flex;
			justify-content: space-between;
			padding: 20rpx;

			image {
				width: 40rpx;
				height: 40rpx;
			}

			:first-child {
				font-weight: bold;
			}
		}

		.indexbody_content {
			background-color: #F8F8F8;
			margin: 10rpx 40rpx;
			padding: 10rpx;
			font-size: 24rpx;

			text {
				padding: 0 16rpx;
				border-right: 2rpx solid #333333;
			}

			:last-child {
				border-right: none;
			}
		}

		.indexbody_address {
			display: flex;
			margin: 20rpx 40rpx;

			image {
				width: 40rpx;
				height: 40rpx;
				margin-right: 18rpx;
			}
		}

		.indexbody_date {
			margin: 20rpx 40rpx;
			padding-bottom: 24rpx;

			image {
				width: 40rpx;
				height: 40rpx;
				margin-right: 18rpx;
			}
		}
	}
</style>
